<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>

    <button id="start">重新开始一把游戏</button>
    

    <div> 输入你要猜得数字：<Input type="text" id="number"> </Input>  <button id="guess">猜</button></div>

    已经猜的次数: <span id="count">0</span>
    <br>
    结果：<span id="result"></span>

    <script>
        $(function(){

            let count=0;
            let number1=Math.floor(Math.random()*100);

            console.log(number1);

            

            $("#start").click(function(){

                count=0;
                $("#count").text(count);
             number=Math.floor(Math.random()*100);

            console.log(number);
            $("#number").val(" ");



            })

            $("#guess").click(function(){

                count++;
                $("#count").text(count);
                let guess=$("#number").val();
                if(guess>number1){
                    $("#result").text("猜大了");
                    $("#result").css("color","red");

                }else if(guess<number1){
                    $("#result").text("猜小了");
                    $("#result").css("color","red");

                }else{
                    $("#result").text("猜对了")
                    $("#result").css("color","green");
                }


            })




        })



    </script>


</body>
</html>